<%@page import="com.gohi.main.util.Utils"%>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="format-detection" content="telephone=no" />
<title>约来约美 -商铺列表</title>
<link rel="stylesheet" href="${static_host}style/jquery.mmenu-5.0.3.css" />
<link rel="stylesheet" href="${static_host}style/mobiscroll.css" />
<link rel="stylesheet" href="${static_host}style/shoplist.css?v=2" />
<link rel="stylesheet" href="${static_host}style/hhframe-1.0.0.css" />
</head>
<body>

	<div class="framepage shoplist">
		<!-- header -->
		<div class="header Searcher">
			<a href="#set_city" class="pos-l hd-city">上海</a>
			<h1 class="hd-title">
				<div class="fm" >
					<input type="text" class="txt" value="${s.store_name}" id="store_name" placeholder="商户名称" /> <input
						type="button" onclick="sendquery()" class="sub" />
				</div>
			</h1>
			<a href="#set_chanel"  class="pos-r" id="servicelable">频道</a> 
		</div>

		<!-- content -->
		<div class="wrapper">
			<div class="content">

				<ul class="cate">
					<li class="sort " order="km"><a href="javascript:;">距离</a></li>
					<li class="sort "  order="sell_count"><a href="javascript:;">销量</a></li>
				<!-- 	<li class="sort" order="person_consume"><a href="javascript:;">价格</a></li> -->
					<li class="sort" order="comment_count"><a href="javascript:;">评价</a></li>
					<li><a href="#Filter">筛选</a></li>
				</ul>
				<div id="contenbody">
				<ul class="shops" id="shops">
				
				</ul>
		     <ul id="servicepanel1">
        <li class="load_more" ><a href="javascript:;" ><p limit="1" class="load" >加载更多</p><p class="state"></p></a></li>
   </ul>
      </div>
      
			</div>
		</div>
		
		<div class="gotoTop">Top</div>

		<!-- footer -->
		<jsp:include page="/inc/storefooter.jsp" />

		<!-- set city -->
		<div id="set_city">
			<div>

				<div class="header">
					<a href="javascript:;" class="pos-l icon hd-return">返回</a>
					<h1 class="hd-title">选择城市</h1>
				</div>

				<p class="tips">已开通服务的城市：</p>
				<div class="citys">
					<ul>
						<s:iterator value="#request.are">
							<li value='${area_id}'><a href="javascript:setcity('${area_id}-${area_name}')">${area_name}</a></li>
						</s:iterator>
	

					</ul>
				</div>

			</div>
		</div>

		<!-- set chanel -->
		<div id="set_chanel">
			<div>

				<div class="header">
					<a href="javascript:;" class="pos-l icon hd-return">返回</a>
					<h1 class="hd-title">选择频道</h1>
				</div>
		<div class="chanels">

					<s:iterator value="#request.sclass" status="i">
						<p class="cate ${i.index==0?'hot':'liren'}">${storeclass.class_name}</p>
						<s:iterator value="list" var="c" status="s">
							<s:if test="#s.first">
								<ul>
							</s:if>
							<li><a href="javascript:classquery('${c.class_id}','${c.class_name}');">${c.class_name}</a></li>
							<s:if test="#s.last">
						</ul>
							</s:if>
						</s:iterator>
					</s:iterator>
				</div>

			</div>
		</div>

		<!-- Filter-->
		<div id="Filter">
			<div>

				<div class="header">
					<a href="javascript:;" class="pos-l icon hd-return">返回</a>
					<h1 class="hd-title">筛选</h1>
				</div>

			<div class="fm">

		
					
					<label>品牌：</label> <input type="hidden" class="brand" />
					<ul class="selectlist brandlist">
						<li value="0" >全部</li>
						<s:iterator value="#request.brand">
						<li value="${brand_id}">${brand_name}</li>
						</s:iterator>
					</ul>

					<label>价格：</label>
					<div class="price">
						<input type="text" value="${s.minprice}" class="min" placeholder="最小价格" /><span>-</span>
						<input type="text" value="${s.maxprice}"  class="max" placeholder="最大价格" />
					</div>
					 <label>区域：</label> 
				    <select id="area" class="area">
				    					<optgroup  label="不限">
											<option value="0">不限</option>
											</optgroup>			
				    					<s:iterator value="#request.aremap">
				    					<optgroup label="${key}">
				    							<s:iterator value="value">
				    							<option parent="${parent_area_id}" value="${area_id}">${area_name}</option>
				    							</s:iterator>
										</optgroup>
				    					</s:iterator>
									</select>  
	<label>优惠类型：</label>
      <ul class="set_discount">
      <li class="active2 ${s.temai_flag=='1'?'active':''}" >限时特卖</li>
      </ul>
									
								 <label>商圈：</label>
				      <input type="hidden" name="" class="street" value="商圈一" />
				      <ul class="selectlist businesslist">
				      <li value="0">不限</li>
				      <s:iterator value="#request.business">
						<li value="${id}">${name}</li>
					</s:iterator>
				
				      </ul>		
				      
				</div> 
			<div class="btns">
					<a href="javascript:;" class="btn">确定</a>
				</div>

			</div>
		</div>

	</div>
<script src="script/jquery-1.11.1.min.js"></script>
<script src="script/jquery.mmenu-5.0.3.js"></script>
<script src="script/mobiscroll.js"></script>
<script src="script/jquery.iscroll.5.js"></script>
<script src="script/hhframe-1.0.0.js"></script>
<script src="script/shoplist.js?a=22"></script>
	<script id="store" type="text/html">
{{# for(var i = 0, len = d.length; i < len; i++){ }}
	  <li>
        <a href="store!detail.do?id={{ d[i].store_id}}" class="{{d[i].temai_flag==0?'':'tag_discount'}}">
        <img src='<s:property value="@com.gohi.main.util.global.GloblConfig@IMG_STORE" />{{d[i].logo}}' class="shopimg" />
        <div>
        <p class="name">{{ d[i].store_name}}</p>
        <p class="info"><span class="stars star{{d[i].store_score}}">星级</span><span class="price"></span></p>
        <p class="addr">地址：{{d[i].address}} </p>
        <p class="dist">距离：{{ d[i].km }}</p>
        </div>
        </a>
      </li>
{{# } }}
	</script>
	<script src="${static_host}script/laytpl.js"></script>
<script src="${static_host}script/public.js"></script>
	<script type="text/javascript">
    var data=${jsonString};
    //alert(data.length)
    function rederData(d){
        var gettpl = document.getElementById('store').innerHTML;
           laytpl(gettpl).render(d, function(html){
        	if(d.length==0){
        		//$(".load").html("没有更多服务");
        	}
            $("#shops").append (html);
        });
    }
    if(data.length==0){
    	$("#contenbody").html('<div class="NoResult"><img src="icons/noresult.png" /><p>没有符合您的商铺</p> </div>')
    }else{
    	 rederData(data);//渲染数据
    }
   
    var query={
    	sort:"asc",//排序的方式
    	orderby:"km",//排序的字段
    	areid:"", //区域的ID
    	brandid:"${s.brand_id}",//品牌的ID
    	classid:"", //项目类型的ID
    	minprice:"",//价格最小
    	maxprice:"",//最大价格
    	title:"" ,//商铺的名字
    	businessid:"",//商圈的
    	temai_flag:"${s.temai_flag}",//商圈的
    	mall_id:"0"//商区的ID
    	
    }
    
    //开始查询
    function sendquery(){
    	var url="store.do?s.sorttype="+query.sort+"&s.orderby="+query.orderby;
    	
    	if(query.classid!=""){
    		url=url+"&s.class_id="+query.classid;
    	}
    	if($("#store_name").val()!=""){
    		url=url+"&s.store_name="+$("#store_name").val();
    	}
    	
    	if(query.brandid!=""){
    		url=url+"&s.brand_id="+query.brandid;
    	}
    	
    	if(query.minprice!="" || query.maxprice!=""){
    		url=url+"&s.minprice="+query.minprice+"&s.maxprice="+query.maxprice;
    	}
    	
    	//商圈查询
    	if(query.businessid!="" || query.businessid!=""){
    		url=url+"&s.area_business_id="+query.businessid;
    	}
    	//行政区域查询
    	if($("#area").val()!="0"){
    		alert($("#area").val());
    		url=url+"&s.mall_id="+$("#area").val();
    	}
    	//特卖信息查询
    	if(query.temai_flag!=""){
    		url=url+"&s.temai_flag="+query.temai_flag;
    	}
    	//查询全部
    	//alert($("option:selected").text());
       //alert($("#area_dummy").attr("parent"));
      // return;
    	if($("option:selected").attr("parent")=="0"){
    		url=url+"&s.area_id=1";
    	}
    	
    	 // alert(url);
    	window.location.href=url;
  
    }
    //类型查询
    function classquery(classid,names){
    	tools.set("classid",classid);
    	tools.set("classname",names);
    	query.classid=classid;
    	sendquery();
    }

    //追加选中的
    if(""=="${s.orderby}"){
    	$("li[order=km]").addClass("selected ${s.sorttype eq 'asc'?'':'down'}");
    }else{
    	  var obj = $("li[order=${s.orderby}]");
		  obj.addClass("selected ${s.sorttype eq 'asc'?'':'down'}");
    }
  
    function init(){
    	if(window.location.href.indexOf("s.class_id")!=-1){
    		if(tools.get("classname")==null){
        		$("#servicelable").text("全部");
        	}else{
        		$("#servicelable").text(tools.get("classname"));
        	}
        	query.classid=tools.get("classid");
    	}
    	
    	
    }
    init();
    
	function setcity(text){
		$.cookie('city', text, {expires : 365});
		window.location.href="store.do";
  }
	
	$(function(){
		//品牌信息
		$(".brandlist li").on("click",function(){
			query.brandid=this.value;
			sendquery();
		})
		//商圈
		$(".businesslist li").on("click",function(){
			//alert(this.value)
			query.businessid=this.value;
			sendquery();
		})
		//回填品牌信息
		$(".brandlist li[value=${s.brand_id==null?0:s.brand_id}]").addClass("selected");
		//回填商圈信息
		$(".businesslist li[value=${s.area_business_id==null?0:s.area_business_id}]").addClass("selected");
		//回填行政区域
		$(".area option[value=${s.mall_id==null?0:s.mall_id}]").attr("selected",true);
		
		$("#Filter .area").mobiscroll().select({theme:"android-holo light",group:true});

	if($("#store_name").val()=="不限"){
		$("#store_name").val("")
	}
	})
	//alert("jk")
    </script>

</body>
</html>